import React, { Component } from 'react'
import axios from 'axios'
import {Switch,Route,Redirect,NavLink} from 'react-router-dom'
import MyRoom from './myroom'
import MyOrder from './myorder'
import Approval from './approval'
import Manger from './manger'

export default class Main extends Component {
    componentDidMount(){
        if(!localStorage.getItem('token')){
            //没有登录
            this.props.history.push('/login')
        }else{
            let {username,rolename} = JSON.parse(localStorage.getItem('userinfo'));
            this.setState({
                username,
                rolename
            })

            let token = localStorage.getItem('token');
            axios.get('/api/power',{headers:{token}}).then(res => {
                console.log(res)
                if(res.data.code === 1){
                    this.setState({
                        powerList:res.data.data
                    })
                }else{
                    alert(res.data.msg)
                }
            })
            
        }
    }
    state = {
        username:'',
        rolename:'',
        powerList:[]
    }
    render() {
        let {username,rolename,powerList} = this.state;
        return (
            <div className="wrap">
                <header>
                    {username}-{rolename} <button onClick={this.exit}>退出</button>
                </header>
                <div className="con">
                    <div className="left">
                        {powerList && powerList.map(item => {
                            return <NavLink key={item.menuapi} to={'/main'+item.menuapi}>{item.menuname}</NavLink>
                        })}
                    </div>
                    <div className="right">
                        <Switch>
                            <Route path='/main/myroom' component={MyRoom}></Route>
                            <Route path="/main/myorder" component={MyOrder}></Route>
                            <Route path='/main/orderapproval' component={Approval}></Route>
                            <Route path="/main/ordermanger" component={Manger}></Route>
                            <Redirect from="/main" to="/main/myroom"></Redirect>
                        </Switch>
                    </div>
                </div>
            </div>
        )
    }

    //退出
    exit = () => {
        //本地存储清空
        localStorage.clear();
        //跳路由
        this.props.history.push('/login');
    }
}
